<template>
  <div class="friend">
    <h3>服务外包</h3> 
    <ul>
      <li>☆    基于行业的咨询与服务</li>
      <li>银行、保险、证劵、物流、交通、制药、通信、教育</li>
      <li>☆    基于解决方案的咨询与服务</li>
      <li>供应链管理（SCM）、客户关系管理（CRM）、企业资源计划（ERP）、电子商务</li>
      <li>☆    IT基础设施和数据安全咨询与服务</li>
      <li>企业应用管理、基础架构管理、服务端平台、数据中心服务、桌面及网络服务</li>
      <li>☆    应用系统开发及维护服务</li>
      <li>企业应用、测试与本地化</li>
    </ul>
    <h3>合作企业</h3>
    <div class="imgs">
      <div class="row" v-for="(image,index) in images" :key="index">
        <img height="70" width="155" :src="image" alt="">
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      msg: 'Welcome to friend',
      images:[
          '../../../static/images/ibm.jpg',
          '../../../static/images/yd.jpg',
          '../../../static/images/fide.jpg',
          '../../../static/images/nec.jpg',
          '../../../static/images/ibm.jpg',
          '../../../static/images/yd.jpg',
          '../../../static/images/fide.jpg',
          '../../../static/images/nec.jpg'
      ]
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
    .friend{
      width:100%;
      height: auto;
      /* border: 1px solid red; */
    
    }
    .friend h3{
      padding:0px 20px;
    }
    .friend p{
       padding: 0px 10px;
    }
    .friend .imgs{
      /* border: 1px solid red; */
      padding: 0px 10px;

    }
    .friend .imgs img{
      margin-left: 15px;
      float: left;
      margin-top: 10px;
  
    }
    .friend .imgs .row{
      /* border: 1px solid red; */
      margin-top: 5px;
    }
    ul{
      list-style-type: none;
      padding: 0px 20px;
    }
    ul li{
      line-height: 180%;
    }
</style>
